// pages/hai/hai.js
const app = getApp()
Page({
  data: {
    cardPath: 'cloud://yun-test-xah29.7975-yun-test-xah29-1302203904/Images/海报.png',
    headPath: 'cloud://yun-test-xah29.7975-yun-test-xah29-1302203904/Images/张伟.jpg',
    sendName: '阿巴阿巴阿巴阿巴',
  },
  onLoad: function (options) {
    var that = this;
    wx: wx.getSystemInfo({
      success: function (res) {
        that.setData({
          pixelRatio: res.pixelRatio,
          windowWidth: res.windowWidth,
          windowHeight: res.windowHeight
        })
      }
    })
    that.drawCanvas();
  },
  //Canvas画图
  drawCanvas: function () {
    this.setData({
      cardPath: this.data.cardPath,
      headPath: this.data.headPath,
      sendName: this.data.sendName
    });
    let ctx = wx.createCanvasContext('myCanvas');
    let ctxW = this.data.windowWidth;
    let ctxH = 1210;
    // 默认像素比
    let pixelRatio = this.data.pixelRatio;
 
    // 垂直渐变
    const grd = ctx.createLinearGradient(0, 0, 0, ctxH);
    grd.addColorStop(0, '#ffffff');
    grd.addColorStop(1, '#ffffff');
    ctx.setFillStyle(grd);
    ctx.fillRect(0, 0, ctxW, ctxH);
 
    wx.getImageInfo({
      src: this.data.cardPath,
      success: (res) => {
        ctx.drawImage(res.path, 15, 15, 345, 470); //card
        wx.getImageInfo({
          src: this.data.headPath,
          success: (res) => {
            /**/
            ctx.arc(46,358,25, 0, 2 * Math.PI)
            ctx.fill()
            ctx.save();
            ctx.beginPath(); //开始绘制
            ctx.clip(); //剪切
            ctx.drawImage(res.path, 23, 333, 50, 50); //userHeader
            ctx.restore(); //恢复之前保存的绘图上下文 继续绘制
            /**/
 
            ctx.setTextAlign('left');
            ctx.setTextBaseline('middle');
            ctx.setFontSize(16);
            ctx.setFillStyle('#fff');
            this.fontLineFeed(ctx, this.data.sendName, 450, 30, 79, 328);
            ctx.stroke();
            ctx.draw();
          }
        })
 
      }
    })
  },
  // 文字换行（字少没有也用不太到，先放着了）
  fontLineFeed: function (ctx, str, splitLen, strHeight, x, y) {
    let strArr = [];
    for (let i = 0, len = str.length / splitLen; i < len; i++) {
      strArr.push(str.substring(i * splitLen, i * splitLen + splitLen));
    }
    let s = 0;
    for (let j = 0, len = strArr.length; j < len; j++) {
      s = s + strHeight;
      ctx.fillText(strArr[j], x, y + s);
    }
  },

  //  下弹框测试
  buttonclick:function(){

    wx.showActionSheet({
      itemList: ["生成海报","B","C"],
      success(res){
        wx.canvasToTempFilePath({
          canvasId: 'myCanvas',
          success: function (res) {
            wx.saveImageToPhotosAlbum({
              filePath: res.tempFilePath,
              success(result) {
                wx.showToast({
                  title: '图片保存成功',
                  icon: 'success',
                  duration: 2000
                })
              }
            })
          }
        })
      }
    })

  },
  
  // 保存图片
  saveImage: function (e) {
    wx.canvasToTempFilePath({
      canvasId: 'myCanvas',
      success: function (res) {
        wx.saveImageToPhotosAlbum({
          filePath: res.tempFilePath,
          success(result) {
            wx.showToast({
              title: '图片保存成功',
              icon: 'success',
              duration: 2000
            })
          }
        })
      }
    })
  },
})